<!DOCTYPE html SYSTEM "http://www.thymeleaf.org/dtd/xhtml1-strict-thymeleaf-spring4-4.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<html >
<head>
    <meta charset="UTF-8">
    <title>Mails Send - Online Judge</title>
    <link rel="stylesheet" th:href="@{/css/styles.css}" >
    <script th:src="@{/js/jquery-1.7.2.js}"></script>
    <script th:src="@{/js/gdoj.js}"></script>
</head>
<style>
    .headerNav{min-width:1024px;width:96%!important;}
    .headerNav ul.hright{margin-right:0px;!important;}
    .container {width:100%!important;}
    body, html {margin:0!important; height:100%!important; overflow-x:hidden!important;overflow-y:hidden!important}
</style>
<body>
<div th:replace="common::web-navbar"></div>
<div id="mail-box">
    <div id="mail-box-left" >
        <div id="mail-box-nav" class="mail-box-second-nav">
            <ul class="hleft">
                <li id="mail-box-nav-content" class="nav_menu">
                    <a href="/mails"><span>[[#{mails.recv}]]</span></a>
                </li>
                <li id="mail-box-nav-status" class="nav_menu  current">
                    <a href="/mails/send"><span class="mail-box-nav-status" >[[#{mails.send}]]</span></a>
                </li>
                <li id="mail-box-nav-new" class="nav_menu">
                    <a href="/mails/new"><span>[[#{mails.new}]]</span></a>
                </li>
            </ul>
            <ul class="hright">
                <li class="nav_menu"> </li>
            </ul>
        </div>
        <div id="mail-box-tables" class="mail-box-tables">
            <div class="mail-tables small-scrollbar">
                <div class="roundbox">
                    <div style="">
                        <table class="mails-list rtable">
                            <tr class="header" style="">
                                <th class="item left-item">[[#{mails.title}]]</th>
                                <th class="date">[[#{mails.date}]]</th>
                            </tr>
                            <tr th:if="${pageInfo.size == 0}"><td class="left-item" colspan="5" style="text-align: left;">There is no records.</td></tr>
                            <tr th:each="mail,stat : ${pageInfo.list}" class="mail-item" th:id="${mail.mail_id}">
                                <td class="item left-item">
                                    <div>
                                        <a th:href="@{/profile/{username}(username=${mail.sendUser.username})}"
                                           class="rated-user" th:classappend="'user-rate-' + ${mail.sendUser.rate} + ' user-tip'"
                                           th:user="${mail.sendUser.username}"
                                           th:text="${mail.sendUser.username}"></a>
                                    </div>
                                    <div >
                                        <span class="title" th:text="${mail.title}"></span>
                                    </div>
                                    <div>
                                        <span class="content" th:text="${mail.content}"></span>
                                    </div>
                                </td>
                                <td class="date" th:title="${#dates.format(mail.create_date,'yyyy-MM-dd HH:mm:ss')}" th:text="${mail.friendlyDate}"></td>
                            </tr>
                        </table>
                    </div>
                    <div style="margin:6px 12px;font-size:15px;">
                        <div class="left"></div>
                        <div class="right">
                            <a th:if="${pageInfo.hasPreviousPage == true}" th:href="@{/mails/send/page/{pageNum}(pageNum=${pageInfo.prePage})}" style="color:#000;text-decoration: none;">&larr;</a>
                            <a th:if="${pageInfo.firstPage > 1}" th:href="@{/mails/send/page/1}" style="color:#000;text-decoration: none;">1</a>
                            <span th:if="${pageInfo.firstPage > 2}"  >...</span>
                            <span th:each="nav:${pageInfo.navigatepageNums}">
                    <a th:href="@{/mails/send/page/{pageNum}(pageNum=${nav})}" th:text="${nav}" th:if="${nav == pageInfo.pageNum}" style="font-weight: bold;color:#000;text-decoration: none;"></a>
                    <a th:href="@{/mails/send/page/{pageNum}(pageNum=${nav})}" th:text="${nav}" th:if="${nav != pageInfo.pageNum}" style="color:#000;text-decoration: none;"></a>
                    </span>
                            <span th:if="${pageInfo.lastPage < pageInfo.pages}" >...</span>
                            <a th:if="${pageInfo.pages > pageInfo.lastPage}" th:href="@{/mails/send/page/{pageNum}(pageNum=${pageInfo.pages})}" th:text="${pageInfo.pages}" style="color:#000;text-decoration: none;"></a>
                            <a th:if="${pageInfo.hasNextPage == true}" th:href="@{/mails/send/page/{pageNum}(pageNum=${pageInfo.nextPage})}" style="color:#000;text-decoration: none;">&rarr;</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div id="bottom-bar-left">
            <div class="bottom_button"></div>
        </div>
    </div>
    <div id="mail-box-drag-bar"></div>
    <div id="mail-box-right">
        <div id="mail-content-box" class="mail-box-new" style="display: none">
            <div class="comment round_0123 mail-edit-box" style="padding: 6px;">
                <form action="" method="post">
                    <input  type="hidden" name="reply" value="0">
                    <div style="padding: 6px 6px;font-size: 13px">
                        <input class="button_submit" type="Submit" th:value="#{mails.btn_send}" >
                        <input class="button_submit" type="button" th:value="#{topic.btn_cancel}" >
                    </div>
                    <div style="">
                        <div>
                            <input class="send-to-user" name="sendto" th:placeholder="#{mails.input_username}" value="">
                        </div>
                        <div>
                            <input class="message-title" id="message-title" th:placeholder="#{mails.input_title}" name="title1" maxlength="100">
                        </div>
                        <textarea class="message-content ke-editor" id="meal-content" name="content" rows="20" ></textarea>
                    </div>
                </form>
            </div>
        </div>
        <div id="mail-content-box" class="mail-content-box">
            <div style="padding: 10px 12px 0px 12px;font-size: 13px">
                <span>答复</span> <span>答复全部</span> <span>转发</span>
            </div>
            <div class="mail-content-info">
            </div>
            <div class="mail-content-data small-scrollbar">
            </div>
        </div>
        <div id="bottom-bar-right">
        </div>
    </div>
</div>
<script type='text/javascript' th:src='@{/js/kindeditor/kindeditor-all.js}' charset='utf-8'></script>
<script type='text/javascript' th:src='@{/js/editor.js}'></script>
<link rel="stylesheet" th:href="@{/js/kindeditor/plugins/code/prettify.css}" />
<link rel="stylesheet" th:href="@{/js/poshytip/tip-whitesimple/tip-whitesimple.css}" type="text/css" />
<script type="text/javascript" th:inline="javascript" th:src="@{/js/mail.js}"></script>
<script type="text/javascript" th:src="@{/js/poshytip/jquery.poshytip.js}"></script>
<script charset="utf-8" th:src="@{/js/kindeditor/plugins/code/prettify.js}"></script>
<script type="text/javascript">
    $(document).ready(function() {
        OnlineJudge.saveUrl();
        OnlineJudge.userTip();
        prettyPrint();
    });
</script>
</body>
</html>
